*{
    margin:5px;
}
ol li{
    font-size:18px;
    margin:10px 0;
    cursor:pointer
}
.showa{
    opacity: 1;
    animation: show-item 1s ease-in forwards
}
.hidea{
    opacity: 0;
    animation: hide-item 1s ease-in forwards;
}

@keyframes hide-item {
    0%{
        opacity: 1;
        color:red
    }
    50%{
        opacity: 0.5;
        color: green
    }
    100%{
        opacity: 0;
        color:blue
    }
}
@keyframes show-item {
    0%{
        opacity: 0;
        color:red
    }
    50%{
        opacity: 0.5;
        color: green
    }
    100%{
        opacity: 1;
        color:blue
    }
}